<template>
    <div class="song-rank">
        <!-- 流行榜 -->
        <Rankfeature :rankfeature="rankfeature" v-if="rankfeature.length !== 0"/>
        <!-- 全球榜 -->
        <Rankglobal :rankglobal="rankglobal" v-if="rankglobal.length !== 0"/>
    </div>
</template>
<script>
import Rankfeature from './Childcomps/Rankfeature.vue'
import Rankglobal from './Childcomps/Rankglobal.vue';
export default {
    name: "",
    components: { Rankfeature, Rankglobal },
    data() {
        return {
            rankfeature:[],
            rankglobal: []
        };
    },
    created() {
        // 获取榜单
        this.getRankDetail();
    },
    methods: {
        async getRankDetail(){
            let resSongRank = await this.$API.songrank.getAllRank();
            if(resSongRank.code == 200){
                let allSongRank = resSongRank.list;
                this.rankfeature = allSongRank.slice(0,4);
                this.rankglobal = allSongRank.slice(4,allSongRank.length);
            }
        }
    },
    
   
}
</script>
<style lang="less" scoped>
    
</style>